<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2019/1/21
  Time: 15:31
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta charset="utf-8">
    <title>新增人员</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="/static/layuiadmin/layui/css/layui.css" media="all">
    <script type="text/javascript" src="/static/layuiadmin/layui/layui.js"></script>
    <script type="text/javascript" src="/static/js/jquery-3.1.1.min.js"></script>
    <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
</head>
<body>

<form id="myform" class="layui-form"  lay-filter="example" >

    <div class="layui-form-item">
        <label class="layui-form-label">用户名:</label>
        <div class="layui-input-block">
            <input value="${people.pname}" type="text" name="pname" lay-verify="pname" autocomplete="off" placeholder="用户名" class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">密码:</label>
        <div class="layui-input-block">
            <input value="${people.password}" type="text" name="password" lay-verify="pass" autocomplete="off" placeholder="请输入密码" class="layui-input">
        </div>
    </div>


    <div class="layui-form-item">
        <label class="layui-form-label">真实姓名:</label>
        <div class="layui-input-block">
            <input value="${people.realname}" type="text" name="realname" lay-verify="required" autocomplete="off" placeholder="姓名" class="layui-input">
        </div>
    </div>

    <div class="layui-form-item" style="display: none">
        <label class="layui-form-label">pid</label>
        <div class="layui-input-block">
            <input value="${people.PId}"  type="text" name="pid" lay-verify="pid" autocomplete="off"  class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">手机号:</label>
        <div class="layui-input-block">
            <input type="text" value="${people.phonenum}" name="phonenum" lay-verify="required|phone|number|phonenum" autocomplete="off" placeholder="手机号" class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">电子邮箱:</label>
        <div class="layui-input-block">
            <input type="text" value="${people.email}" name="email" lay-verify="email" autocomplete="off" placeholder="电子邮箱" class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">所属机构:</label>
        <div class="layui-input-inline">
            <select name="mid" lay-filter="mechanism" lay-verify="required">
                <c:forEach var="l" items="${mechanisms}">
                    <option name="option" value="${l.mid}" <c:if test="${l.mid==people.mid}">selected="selected"</c:if> >${l.mname}</option>
                </c:forEach>
            </select>
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">角色:</label>
        <div class="layui-input-inline">
            <select name="rid" lay-filter="role" lay-verify="required">
                <c:forEach var="l" items="${roles}">
                    <option  value="${l.rid}" <c:if test="${l.rid==people.rid}"> selected="selected"</c:if>  >${l.rname}</option>
                </c:forEach>
            </select>
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">所属部门:</label>
        <div class="layui-input-inline">
            <select name="did" lay-filter="dept" lay-verify="required">
                <c:forEach var="dept" items="${depts}">
                    <option name="option" value="${dept.did}" <c:if test="${dept.did==people.did}">selected="selected"</c:if>>${dept.dname}</option>
                </c:forEach>
            </select>
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">状态</label>
        <div class="layui-input-block">
            <select name="status" lay-verify="required">
                <option value="0">冻结</option>
                <option value="1">激活</option>
            </select>
        </div>
    </div>

    <div class="layui-form-item">
        <div class="layui-input-block">
            <button class="layui-btn" lay-submit lay-filter="demo1" >立即提交</button>
        </div>
    </div>


</form>

<script>
    layui.use(['form', 'layedit', 'laydate'], function(){
        var form = layui.form
            ,layer = layui.layer
            ,layedit = layui.layedit
            ,laydate = layui.laydate;

        //自定义验证规则
        form.verify({
            pname: function(value){
                var message="";
                if(value==""){
                    return '用户名不能为空';
                }
                if(/(^\_)|(\__)|(\_+$)/.test(value)){
                    return '用户名首尾不能出现下划线\'_\'';
                }

                if(/^\d+\d+\d$/.test(value)){
                    return '用户名不能全为数字';
                }
                $.ajax({
                    type:"post",
                    dataType: "json",
                    url:"/people/findPn",
                    async: false,
                    data:{pname:value,pid:${people.PId}},
                    success: function(data) {
                        console.log(data.msgs);
                        message=data.msgs;
                    }
                });
                if(message==0){
                    return '用户名已存在';
                }
            },
            phonenum:function (value) {
                var message="";
                $.ajax({
                    type:"post",
                    dataType: "json",
                    url:"/people/findP",
                    async: false,
                    data:{phone:value,pid:${people.PId}},
                    success: function(data) {
                        console.log(data.msgs);
                        message=data.msgs;
                    }
                });
                if(message==0){
                    return '手机号已存在';
                }
            },
            pass:function (value) {
                    if(!/^[a-zA-Z0-9]{6,10}$/.test(value)){
                        return '密码必须6-12位数';
                    }
            }
    });

        //监听提交
        form.on('submit(demo1)', function(data){
            $.ajax({
                url:"/people/updatePeople",
                type:"POST",
                datatype: "json",
                async: false,
                data:{"people": JSON.stringify($('#myform').serializeObject())},// 序列化表单值成json对象
                success: function(data) {
                    alert(data.msg);
                    var index = parent.layer.getFrameIndex(window.name);
                    parent.layer.close(index);
                }
            });
            return false;
        });

    });

</script>
</body>

<script>
    jQuery.prototype.serializeObject=function(){
        var obj=new Object();
        $.each(this.serializeArray(),function(index,param){
            if(!(param.name in obj)){
                obj[param.name]=param.value;
            }
        });
        return obj;
    };
</script>

</html>
